{% extends 'BASE/base.html' %}
{% block css %}
{% load static %}
<link rel="stylesheet" type="text/css" href="{% static 'css/Index/index.css' %}"/>
<link rel="stylesheet" type="text/css" href="{% static 'css/Comic/readingRoom.css' %}"/>
{% endblock %}
{% block js %}
<script src="{% static 'js/Novels/readingRoom.js' %}" type="text/javascript" charset="utf-8"></script>
{% endblock %}
{% block title %} {{novel.fName}}-书漫网O(∩_∩)O哈哈~ {% endblock %}
{% block main %}
<div class="container-fluid mt-5">
    <div class="row justify-content-center text-center">
        <div class="col-2 bd-sidebar " style="padding: 0;">
            <div class="accordion" id="Catalog">
                <div class="card">
                    <div class="card-header" id="heading">
                        <h2 class="mb-0">
                            <button class="btn btn-block" type="button" data-toggle="collapse" data-target="#collapse"
                                    aria-expanded="true"
                                    aria-controls="collapse">
                                目录
                            </button>
                        </h2>
                    </div>
                    <div id="collapse" class="collapse show" aria-labelledby="heading" data-parent="#Catalog">
                        <div class="card-body pre-scrollable">
                            {# 展示目录 #}
                            {% for book,book_data in novel.books_info.items %}
                            {% for chapter_data in book_data.chapter_info %}
                            <div class="row justify-content-center">
                                <a href="javascript:;" txt="{{chapter_data.saveurl}}"
                                   onclick="reading('{{novel.fId}}','{{book}}/{{chapter_data.chapter}}')">{{book_data.bookName}}
                                    第{{chapter_data.chapter}}章:<br>{{chapter_data.chapterName}}</a>
                            </div>
                            {% endfor %}
                            {% endfor %}
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col">
            <div class="row justify-content-center">
                <div class="col-lg-10 col-sm-12" id="canvas">
                    <iframe src="{{ novel.history.readagain.readurl|default_if_none:novel.books_info.1.chapter_info.0.saveurl }}"
                            id="novel_txt"
                            name="novel_txt"
                            frameborder="0"
                            scrolling="no"
                            width="100%"
                            onload=""></iframe>
                </div>
            </div>
        </div>
        <div class="col-2">

        </div>
    </div>
</div>
{% endblock %}
